<template>
  <div class=" pl10 flex fd-c h-all">
    <div class="pp10 flex ai-c">
      <span @click="toUrl($router,'/eng/english')" :class="$route.name=='eng.english'?'fc-pri':''" class="fs-18 white-text nodarg mr15 ra-5 hand">音标</span>
      <span @click="toUrl($router,'/eng/danchi')" :class="$route.name=='eng.danchi'?'fc-pri':''" class="fs-18 white-text nodarg mr15 ra-5 hand">单词</span>
      <span @click="toUrl($router,'/eng/dictation')" :class="$route.name=='eng.dictation'?'fc-pri':''" class="fs-18 white-text mr15 nodarg ra-5 hand">单词听写</span>
      <span @click="toUrl($router,'/eng/phrase')" :class="$route.name=='eng.phrase'?'fc-pri':''" class="fs-18 white-text mr15 nodarg ra-5 hand">短语</span>
      <span @click="toUrl($router,'/eng/reading')" :class="$route.name=='eng.reading'?'fc-pri':''" class="fs-18 white-text mr15 nodarg ra-5 hand">晨读</span>
      <span @click="toUrl($router,'/eng/freedom')" :class="$route.name=='eng.freedom'?'fc-pri':''" class="fs-18 white-text mr15 nodarg ra-5 hand">自由朗读</span>
      <span @click="toUrl($router,'/eng/listen')" :class="$route.name=='eng.listen'?'fc-pri':''" class="fs-18 white-text mr15 nodarg ra-5 hand">听力练习</span>
      <span @click="toUrl($router,'/eng/history')" :class="$route.name=='eng.history'?'fc-pri':''" class="fs-18 white-text mr15 nodarg ra-5 hand">历使记录</span>
    </div>

    <div class="flex-1 nodarg h-all w-all">
      <router-view></router-view>
    </div>
  </div>
</template>

<script setup lang='ts'>
import { ref } from 'vue';
import yy from '@lib/mixin';
import useStore from '../../store';
const st = useStore();

function toUrl(r, path) {
  if (!st.rDetail.isRoter) {
    yy.msg.error(st.rDetail.msg);
    return;
  }
  r.push(path)
}
</script>

<style lang='less'>
</style>